<template>
	<AdminLayout activeKey="audit-workbench" :breadcrumbs="['首页','内容管控','审核员工作台']" tabTitle="审核员工作台" currentPage="audit-workbench">
		<view class="page">
			<!-- 页面头部 -->
			<view class="page-header">
				<view class="header-info">
					<text class="page-title">审核工作台</text>
					<text class="page-subtitle">统一管理所有待审核内容</text>
				</view>
				<view class="header-actions">
					<button class="btn-primary" @click="loadAllData">
						<text class="btn-icon iconfont icon-shuaxin"></text>
						刷新数据
					</button>
				</view>
			</view>

			<!-- 统计卡片 -->
			<view class="stats-cards">
				<view class="stat-card">
					<text class="stat-number">{{ stats.total }}</text>
					<text class="stat-label">待审核总数</text>
				</view>
				<view class="stat-card">
					<text class="stat-number">{{ stats.tasks }}</text>
					<text class="stat-label">待审核任务</text>
				</view>
				<view class="stat-card">
					<text class="stat-number">{{ stats.activities }}</text>
					<text class="stat-label">待审核活动</text>
				</view>
				<view class="stat-card">
					<text class="stat-number">{{ stats.posts }}</text>
					<text class="stat-label">待审核帖子</text>
				</view>
			</view>

			<!-- 今日审核概览 -->
			<view class="today-overview">
				<view class="overview-header">
					<text class="overview-title">
						<text class="iconfont icon-riqi"></text>
						今日审核概览
					</text>
					<text class="overview-date">{{ getCurrentDate() }}</text>
				</view>
				<view class="overview-grid">
					<view class="overview-item">
						<text class="overview-value">{{ todayStats.total }}</text>
						<text class="overview-label">已审核</text>
					</view>
					<view class="overview-item success">
						<text class="overview-value">{{ todayStats.approved }}</text>
						<text class="overview-label">已通过</text>
					</view>
					<view class="overview-item danger">
						<text class="overview-value">{{ todayStats.rejected }}</text>
						<text class="overview-label">已拒绝</text>
					</view>
					<view class="overview-item info">
						<text class="overview-value">{{ todayStats.avgTime }}</text>
						<text class="overview-label">平均时长</text>
					</view>
				</view>
			</view>

			<!-- 最近审核动态 -->
			<view class="recent-audits">
				<view class="recent-header">
					<text class="recent-title">
						<text class="iconfont icon-shijian"></text>
						最近审核动态
					</text>
					<navigator url="/pages/admin/audit-history/index" class="link-all">
						查看全部
						<text class="iconfont icon-gengduo"></text>
					</navigator>
				</view>
				<view class="recent-list">
					<view v-for="(item, index) in recentAudits" :key="index" class="recent-item">
						<view class="recent-icon" :class="item.result">
							<text class="iconfont" :class="item.result === 'approved' ? 'icon-chenggong' : 'icon-guanbi'"></text>
						</view>
						<view class="recent-content">
							<text class="recent-text">
								{{ item.time }} {{ item.result === 'approved' ? '通过' : '拒绝' }}了
								<text class="recent-title-text">「{{ item.title }}」</text>
							</text>
							<text class="recent-meta">{{ item.type }} · 发布者: {{ item.publisher }}</text>
						</view>
					</view>
					<view v-if="recentAudits.length === 0" class="recent-empty">
						<text class="iconfont icon-kongxinwenjian"></text>
						<text>今日暂无审核记录</text>
					</view>
				</view>
			</view>

			<!-- 快捷入口面板 -->
			<view class="quick-access">
				<view class="quick-header">
					<text class="quick-title">
						快速访问
					</text>
				</view>
				<view class="quick-grid">
					<navigator url="/pages/admin/audit-history/index" class="quick-card">
						<text class="quick-name">审核历史</text>
						<text class="quick-count">{{ quickStats.history }}条记录</text>
					</navigator>
					<navigator url="/pages/admin/rejected-content/index" class="quick-card">
						<text class="quick-name">复审内容库</text>
						<text class="quick-count">{{ quickStats.rejected }}条违规</text>
					</navigator>
					<navigator url="/pages/admin/task-audit/index" class="quick-card">
						<text class="quick-name">任务审核</text>
						<text class="quick-count">待处理</text>
					</navigator>
					<navigator url="/pages/admin/activity-audit/index" class="quick-card">
						<text class="quick-name">活动审核</text>
						<text class="quick-count">待处理</text>
					</navigator>
				</view>
			</view>
		</view>
	</AdminLayout>
</template>

<script>
import AdminLayout from '@/components/AdminLayout.vue'

export default {
	components: { AdminLayout },
	data() {
		return {
			stats: {
				total: 0,
				tasks: 0,
				activities: 0,
				posts: 0
			},
			loading: false,
			// 今日审核统计
			todayStats: {
				total: 0,
				approved: 0,
				rejected: 0,
				avgTime: '0分钟'
			},
			// 最近审核记录
			recentAudits: [],
			// 快捷统计
			quickStats: {
				history: 0,
				rejected: 0
			}
		}
	},
	onLoad() {
		this.loadAllData()
		this.loadTodayStats()
		this.loadRecentAudits()
		this.loadQuickStats()
	},
	methods: {
		async loadAllData() {
			this.loading = true
			try {
				// 只加载统计数据
				const res = await uniCloud.callFunction({
					name: 'initAdmin',
					data: {
						action: 'getPendingAudits'
					}
				})
				
				if (res.result && res.result.code === 0) {
					const data = res.result.data || {}
					// 更新统计
					this.stats.tasks = data.tasks?.length || 0
					this.stats.activities = data.activities?.length || 0
					this.stats.posts = data.posts?.length || 0
					this.stats.total = this.stats.tasks + this.stats.activities + this.stats.posts
				} else {
					uni.showToast({ title: '加载失败', icon: 'none' })
				}
			} catch (e) {
				console.error('加载统计数据失败:', e)
				uni.showToast({ title: '加载失败', icon: 'none' })
			} finally {
				this.loading = false
			}
			
			// 同时刷新其他数据
			this.loadTodayStats()
			this.loadRecentAudits()
			this.loadQuickStats()
		},
		
		getTypeName(type) {
			const names = {
				task: '任务',
				activity: '活动',
				post: '帖子'
			}
			return names[type] || type
		},
		
		formatTime(timestamp) {
			if (!timestamp) return '-'
			const date = new Date(timestamp)
			const now = new Date()
			const diff = now - date
			
			if (diff < 60000) return '刚刚'
			if (diff < 3600000) return Math.floor(diff / 60000) + '分钟前'
			if (diff < 86400000) return Math.floor(diff / 3600000) + '小时前'
			if (diff < 604800000) return Math.floor(diff / 86400000) + '天前'
			
			return date.toLocaleDateString('zh-CN')
		},
		
		// 获取当前日期
		getCurrentDate() {
			const now = new Date()
			const year = now.getFullYear()
			const month = String(now.getMonth() + 1).padStart(2, '0')
			const day = String(now.getDate()).padStart(2, '0')
			return `${year}年${month}月${day}日`
		},
		
	// 加载今日审核统计
	async loadTodayStats() {
		try {
			const res = await uniCloud.callFunction({
				name: 'initAdmin',
				data: {
					action: 'getAuditHistory'
				}
			})
			
			if (res.result && res.result.code === 0) {
				const history = res.result.data || []
				
				// 计算今天的开始时间（00:00:00）
				const now = new Date()
				const todayStart = new Date(now.getFullYear(), now.getMonth(), now.getDate()).getTime()
				
				// 筛选今日的审核记录
				const todayRecords = history.filter(record => {
					const recordTime = typeof record.audit_time === 'string' 
						? new Date(record.audit_time).getTime() 
						: record.audit_time
					return recordTime >= todayStart
				})
				
				// 统计通过和拒绝数量
				const approved = todayRecords.filter(r => r.audit_result === 'approved').length
				const rejected = todayRecords.filter(r => r.audit_result === 'rejected').length
				
				this.todayStats = {
					total: todayRecords.length,
					approved: approved,
					rejected: rejected,
					avgTime: '5分钟' // 可以后续从云函数返回
				}
			}
		} catch (e) {
			console.error('加载今日统计失败:', e)
		}
	},
		
		// 加载最近审核记录
		async loadRecentAudits() {
			try {
				const res = await uniCloud.callFunction({
					name: 'initAdmin',
					data: {
						action: 'getAuditHistory'
					}
				})
				
				if (res.result && res.result.code === 0) {
					const history = res.result.data || []
					// 只取最近5条
					this.recentAudits = history.slice(0, 5).map(record => ({
						title: record.content_title || '无标题',
						type: this.getTypeName(record.content_type),
						publisher: record.publisher_name || '未知',
						result: record.audit_result,
						time: this.formatTime(record.audit_time)
					}))
				}
			} catch (e) {
				console.error('加载最近审核失败:', e)
			}
		},
		
		// 加载快捷统计
		async loadQuickStats() {
			try {
				// 加载审核历史总数
				const historyRes = await uniCloud.callFunction({
					name: 'initAdmin',
					data: {
						action: 'getAuditHistory'
					}
				})
				
				if (historyRes.result && historyRes.result.code === 0) {
					this.quickStats.history = (historyRes.result.data || []).length
				}
				
				// 加载违规内容总数
				const rejectedRes = await uniCloud.callFunction({
					name: 'initAdmin',
					data: {
						action: 'getRejectedContent'
					}
				})
				
				if (rejectedRes.result && rejectedRes.result.code === 0) {
					const data = rejectedRes.result.data || {}
					this.quickStats.rejected = (data.tasks || []).length + 
					                           (data.activities || []).length + 
					                           (data.posts || []).length
				}
			} catch (e) {
				console.error('加载快捷统计失败:', e)
			}
		}
	}
}
</script>

<style scoped>
.page {
	padding: 32rpx;
	background: #f8fafc;
	min-height: 100vh;
}

/* 页面头部 */
.page-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 32rpx;
}

.header-info .page-title {
	font-size: 48rpx;
	font-weight: 700;
	color: #1a202c;
	margin-bottom: 8rpx;
	display: block;
}

.header-info .page-subtitle {
	font-size: 28rpx;
	color: #718096;
	display: block;
}

.btn-primary {
	display: flex;
	align-items: center;
	gap: 8rpx;
	background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
	color: #fff;
	border: none;
	border-radius: 16rpx;
	padding: 20rpx 32rpx;
	font-size: 28rpx;
	font-weight: 500;
	box-shadow: 0 4rpx 12rpx rgba(59, 130, 246, 0.3);
	transition: all 0.2s ease;
}

.btn-primary:hover {
	transform: translateY(-2rpx);
	box-shadow: 0 6rpx 16rpx rgba(37, 99, 235, 0.4);
}

.btn-icon {
	font-size: 28rpx;
}

/* 统计卡片 */
.stats-cards {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24rpx;
	margin-bottom: 32rpx;
}

.stat-card {
	background: #fff;
	border-radius: 20rpx;
	padding: 32rpx;
	display: flex;
	align-items: center;
	gap: 24rpx;
	box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);
	border: 2rpx solid #f1f5f9;
	transition: all 0.3s ease;
	cursor: pointer;
}

.stat-card:hover {
	transform: translateY(-4rpx);
	box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.1);
}

.stat-icon {
	width: 96rpx;
	height: 96rpx;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 40rpx;
}

.stat-icon.all {
	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
	color: #fff;
}

.stat-icon.task {
	background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
	color: #fff;
}

.stat-icon.activity {
	background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
	color: #fff;
}

.stat-icon.post {
	background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
	color: #fff;
}

.stat-info {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 8rpx;
}

.stat-number {
	font-size: 48rpx;
	font-weight: 800;
	color: #1a202c;
}

.stat-label {
	font-size: 26rpx;
	color: #718096;
}

/* 今日审核概览 */
.today-overview {
	background: #fff;
	border-radius: 20rpx;
	padding: 32rpx;
	margin-top: 32rpx;
	box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);
	border: 2rpx solid #f1f5f9;
}

.overview-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 24rpx;
	padding-bottom: 20rpx;
	border-bottom: 2rpx solid #e2e8f0;
}

.overview-title {
	font-size: 32rpx;
	font-weight: 700;
	color: #1e293b;
	display: flex;
	align-items: center;
	gap: 8rpx;
}

.overview-title .iconfont {
	font-size: 28rpx;
	color: #64748b;
}

.overview-date {
	font-size: 24rpx;
	color: #64748b;
}

.overview-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16rpx;
}

.overview-item {
	background: #f8fafc;
	border-radius: 16rpx;
	padding: 24rpx;
	text-align: center;
	border: 2rpx solid #e2e8f0;
	transition: all 0.3s ease;
}

.overview-item:hover {
	transform: translateY(-2rpx);
	box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.08);
}

.overview-item.success {
	background: #f0fdf4;
	border-color: #bbf7d0;
}

.overview-item.danger {
	background: #fef2f2;
	border-color: #fecaca;
}

.overview-item.info {
	background: #eff6ff;
	border-color: #bfdbfe;
}

.overview-value {
	display: block;
	font-size: 48rpx;
	font-weight: 800;
	color: #1e293b;
	margin-bottom: 8rpx;
}

.overview-item.success .overview-value {
	color: #059669;
}

.overview-item.danger .overview-value {
	color: #dc2626;
}

.overview-item.info .overview-value {
	color: #3b82f6;
}

.overview-label {
	font-size: 24rpx;
	color: #64748b;
}

/* 最近审核动态 */
.recent-audits {
	background: #fff;
	border-radius: 20rpx;
	padding: 32rpx;
	margin-top: 24rpx;
	box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);
	border: 2rpx solid #f1f5f9;
}

.recent-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 24rpx;
}

.recent-title {
	font-size: 32rpx;
	font-weight: 700;
	color: #1e293b;
	display: flex;
	align-items: center;
	gap: 8rpx;
}

.recent-title .iconfont {
	font-size: 28rpx;
}

.link-all {
	display: flex;
	align-items: center;
	gap: 4rpx;
	font-size: 24rpx;
	color: #3b82f6;
	transition: all 0.2s ease;
	text-decoration: none;
}

.link-all:hover {
	color: #2563eb;
}

.link-all .iconfont {
	font-size: 20rpx;
}

.recent-list {
	display: flex;
	flex-direction: column;
	gap: 16rpx;
}

.recent-item {
	display: flex;
	gap: 16rpx;
	padding: 16rpx;
	background: #f8fafc;
	border-radius: 12rpx;
	transition: all 0.2s ease;
}

.recent-item:hover {
	background: #f1f5f9;
}

.recent-icon {
	width: 48rpx;
	height: 48rpx;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24rpx;
	color: #fff;
	flex-shrink: 0;
}

.recent-icon.approved {
	background: linear-gradient(135deg, #10b981 0%, #059669 100%);
}

.recent-icon.rejected {
	background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
}

.recent-content {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 4rpx;
}

.recent-text {
	font-size: 26rpx;
	color: #475569;
	line-height: 1.5;
}

.recent-title-text {
	font-weight: 600;
	color: #1e293b;
}

.recent-meta {
	font-size: 22rpx;
	color: #94a3b8;
}

.recent-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 60rpx 20rpx;
	color: #cbd5e1;
	gap: 12rpx;
}

.recent-empty .iconfont {
	font-size: 80rpx;
}

/* 快捷入口面板 */
.quick-access {
	background: #fff;
	border-radius: 20rpx;
	padding: 32rpx;
	margin-top: 24rpx;
	box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);
	border: 2rpx solid #f1f5f9;
}

.quick-header {
	margin-bottom: 24rpx;
}

.quick-title {
	font-size: 32rpx;
	font-weight: 700;
	color: #1e293b;
	display: flex;
	align-items: center;
	gap: 8rpx;
}

.quick-title .iconfont {
	font-size: 28rpx;
}

.quick-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20rpx;
}

.quick-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12rpx;
	padding: 32rpx 24rpx;
	background: #f8fafc;
	border-radius: 16rpx;
	border: 2rpx solid #e2e8f0;
	transition: all 0.3s ease;
	text-decoration: none;
}

.quick-card:hover {
	transform: translateY(-4rpx);
	box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.1);
	background: #fff;
}

.quick-icon {
	width: 96rpx;
	height: 96rpx;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 44rpx;
	color: #fff;
}

.quick-icon.history {
	background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);
}

.quick-icon.rejected {
	background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
}

.quick-icon.task {
	background: linear-gradient(135deg, #ec4899 0%, #db2777 100%);
}

.quick-icon.activity {
	background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
}

.quick-name {
	font-size: 28rpx;
	font-weight: 600;
	color: #1e293b;
}

.quick-count {
	font-size: 22rpx;
	color: #94a3b8;
}

/* 响应式 */
@media (max-width: 900px) {
	.stats-cards {
		grid-template-columns: repeat(2, 1fr);
	}
	
	.overview-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	
	.quick-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}
</style>

